<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>星星点灯</title>
  <meta name="description" content="星星点灯网，致力于关爱自闭症人群">
  <meta name="keywords" content="自闭症，关爱，志愿者">
  <link rel="stylesheet" href="./css/base.css">
  <link rel="stylesheet" href="./css/post.css">
  <link rel="stylesheet" href="./css/head.css">
   <!-- 开发环境版本，包含了有帮助的命令行警告 -->
   <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
   <!-- 官网提供的 axios 在线地址 -->
   <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
</head>

<body>
  <script src="../js/jquery-3.5.1.min.js"></script>
  <script type="text/javascript">
    $.ajax({
      type: "get",
      data: { action: "list_partial_title", catalog: "科普贴" },
      url: "../BBS/list_BBS_content",
      dataType: "json",
      success: function (data) {
        var count = data.retlist.length;
        if (count >= 1)
          $("#科普1").text((JSON.stringify(data.retlist[0].帖子标题).replace("\"", "")).replace("\"", ""));
        if (count >= 2)
          $("#科普2").text((JSON.stringify(data.retlist[1].帖子标题).replace("\"", "")).replace("\"", ""));
        if (count >= 3)
          $("#科普3").text((JSON.stringify(data.retlist[2].帖子标题).replace("\"", "")).replace("\"", ""));
        if (count >= 4)
          $("#科普4").text((JSON.stringify(data.retlist[3].帖子标题).replace("\"", "")).replace("\"", ""));
      }
    })
    $.ajax({
      type: "get",
      data: { action: "list_partial_title", catalog: "经验贴" },
      url: "../BBS/list_BBS_content",
      dataType: "json",
      success: function (data) {
        var count = data.retlist.length;
        if (count >= 1)
          $("#经验1").text((JSON.stringify(data.retlist[0].帖子标题).replace("\"", "")).replace("\"", ""));
        if (count >= 2)
          $("#经验2").text((JSON.stringify(data.retlist[1].帖子标题).replace("\"", "")).replace("\"", ""));
        if (count >= 3)
          $("#经验3").text((JSON.stringify(data.retlist[2].帖子标题).replace("\"", "")).replace("\"", ""));
        if (count >= 4)
          $("#经验4").text((JSON.stringify(data.retlist[3].帖子标题).replace("\"", "")).replace("\"", ""));
      }
    })
    $.ajax({
      type: "get",
      data: { action: "list_partial_title", catalog: "求助贴" },
      url: "../BBS/list_BBS_content",
      dataType: "json",
      success: function (data) {
        var count = data.retlist.length;
        if (count >= 1)
          $("#求助1").text((JSON.stringify(data.retlist[0].帖子标题).replace("\"", "")).replace("\"", ""));
        if (count >= 2)
          $("#求助2").text((JSON.stringify(data.retlist[1].帖子标题).replace("\"", "")).replace("\"", ""));
        if (count >= 3)
          $("#求助3").text((JSON.stringify(data.retlist[2].帖子标题).replace("\"", "")).replace("\"", ""));
        if (count >= 4)
          $("#求助4").text((JSON.stringify(data.retlist[3].帖子标题).replace("\"", "")).replace("\"", ""));
      }
    })
    $.ajax({
      type: "get",
      data: { action: "list_partial_title", catalog: "交流贴" },
      url: "../BBS/list_BBS_content",
      dataType: "json",
      success: function (data) {
        var count = data.retlist.length;
        if (count >= 1)
          $("#交流1").text((JSON.stringify(data.retlist[0].帖子标题).replace("\"", "")).replace("\"", ""));
        if (count >= 2)
          $("#交流2").text((JSON.stringify(data.retlist[1].帖子标题).replace("\"", "")).replace("\"", ""));
        if (count >= 3)
          $("#交流3").text((JSON.stringify(data.retlist[2].帖子标题).replace("\"", "")).replace("\"", ""));
        if (count >= 4)
          $("#交流4").text((JSON.stringify(data.retlist[3].帖子标题).replace("\"", "")).replace("\"", ""));
      }
    })




  </script>
   <!-- 头部 -->
   <header id="head">
    <!-- 快捷菜单  -->
    <div class="post-shortcut">
        <nav class="container">
          <div class="logo fl">
          </div>
            <ul class="left fl">
                <li><a href="#">活动</a></li>
                <li>|<a href="./post.html">论坛</a></li>
                <li>|<a href="#">义卖</a></li>
            </ul>
            <ul class="right fr">
                <li v-if="isLoad" @click="load"><a href="#">未登录</a>|</li>
                <li v-if="!isLoad"><a href="#"><div class="ava"><img src="./uploads/ava.jpg" alt="" @mouseover="cardLoad" :class="!cardShow?'small':'big'"></div></a><span>吃果冻</span>|</li>
                <li v-if="!isLoad" @click="load"><a href="#">退出登录</a>|</li>
                <li v-if="!isLoad"><a href="#">个人主页</a>|</li>
                <li><a href="#">客服</a></li>
            </ul>
        </nav>
    </div>
    <div class="card"  v-if="cardShow" @mouseleave="cardLoad">
        <ul>
            <li>监护人</li>
            <li><a href="#">收到的消息</a></li>
            <li><a href="#">收到的回复</a></li>
            <li><a href="#">待办的活动</a></li>
        </ul>
    </div>
</header>
  <nav class="post-nav container">
    <!-- logo -->
    <h1 class="p-logo fl"><a href="#"></a></h1>
    <!-- nave -->
    <nav class="fl">
      <ul>
        <li><a href="post-detail.html">经验贴</a></li>
        <li><a href="post-detail.html">科普贴</a></li>
        <li><a href="post-detail.html">求助帖</a></li>
        <li><a href="post-detail.html">交流贴</a></li>
      </ul>
    </nav>
    <!-- 搜索 -->
    <div class="search fl">
      <input type="search" placeholder="搜一搜">
    </div>
  </nav>
  <hr>
  <!-- 经验贴模块 -->
  <div class="post-content container-list">
    <!-- 头部 -->
    <div class="content-hd">
      <!-- 左边 -->
      <h2 class="fl">
        经验贴 <span>交流经验 更好呵护</span>
      </h2>
      <!-- 右侧a -->
      <a href="post-detail.html" class="fr">查看全部</a>
    </div>
    <!-- 列表 -->
    <ul class="content-list clearfix">
      <li>
        <a href="#">
          <h3 id="经验1"></h3>
        </a>
      </li>
      <li>
        <a href="#">
          <h3 id="经验2"></h3>
        </a>
      </li>
      <li>
        <a href="#">
          <h3 id="经验3"></h3>
      </li>
      <li>
        <a href="#">
          <h3 id="经验4"></h3>
        </a>
      </li>
    </ul>
  </div>
  <!-- 科普贴模块 -->
  <div class="post-content container-list">
    <!-- 头部 -->
    <div class="content-hd">
      <!-- 左边 -->
      <h2 class="fl">
        科普贴 <span>科普知识 防止错误</span>
      </h2>
      <!-- 右侧a -->
      <a href="post-detail.html" class="fr">查看全部</a>
    </div>
    <!-- 列表 -->
    <ul class="content-list clearfix">
      <li>
        <a href="#">
          <h3 id="科普1"></h3>
        </a>
      </li>
      <li>
        <a href="#">
          <h3 id="科普2"></h3>
        </a>
      </li>
      <li>
        <a href="#">
          <h3 id="科普3"></h3>
      </li>
      <li>
        <a href="#">
          <h3 id="科普4"></h3>
        </a>
      </li>
    </ul>
  </div>
  <!-- 求助贴模块 -->
  <div class="post-content container-list">
    <!-- 头部 -->
    <div class="content-hd">
      <!-- 左边 -->
      <h2 class="fl">
        求助贴 <span>互帮互助 团结抗病</span>
      </h2>
      <!-- 右侧a -->
      <a href="post-detail.html" class="fr">查看全部</a>
    </div>
    <!-- 列表 -->
    <ul class="content-list clearfix">
      <li>
        <a href="#">
          <h3 id="求助1"></h3>
        </a>
      </li>
      <li>
        <a href="#">
          <h3 id="求助2"></h3>
        </a>
      </li>
      <li>
        <a href="#">
          <h3 id="求助3"></h3>
      </li>
      <li>
        <a href="#">
          <h3 id="求助4"></h3>
        </a>
      </li>
    </ul>
  </div>
  <!-- 交流贴模块 -->
  <div class="post-content container-list">
    <!-- 头部 -->
    <div class="content-hd">
      <!-- 左边 -->
      <h2 class="fl">
        交流贴 <span>交流讨论 解决盲点</span>
      </h2>
      <!-- 右侧a -->
      <a href="post-detail.html" class="fr">查看全部</a>
    </div>
    <!-- 列表 -->
    <ul class="content-list clearfix">
      <li>
        <a href="#">
          <h3 id="交流1"></h3>
        </a>
      </li>
      <li>
        <a href="#">
          <h3 id="交流2"></h3>
        </a>
      </li>
      <li>
        <a href="#">
          <h3 id="交流3"></h3>
      </li>
      <li>
        <a href="#">
          <h3 id="交流4"></h3>
        </a>
      </li>
    </ul>
  </div>
  <!-- <div class="post-page container">
    <ul>        
        <li><a href="#"></a></li>
        <li><a href="#">1</a></li>
        <li><a href="#">2</a></li>
        <li><a href="#">3</a></li>
        <li><a href="#">4</a></li>
        <li><a href="#">5</a></li>        
        <li><a href="#"></a></li>
    </ul>
  </div> -->
  <script src="./js/head.js" type="text/javascript"></script>
</body>

</html>